<!--
  -- @module vue-demo
  -- @desc 列表-列表展示
  -- @author ervinewell on 2017/4/7
  -->

<template>
  <div>
    <div v-if="loading">加载中...</div>
    <table v-else>
      <tr>
        <th>编号</th>
        <th>标题</th>
        <th>创建者</th>
        <th>创建时间</th>
        <th>操作</th>
      </tr>
      <template>
        <tr v-for="item in list">
          <td>{{ item.number }}</td>
          <td>{{ item.title }}</td>
          <td>{{ item.creator }}</td>
          <td>{{ item.createdAt }}</td>
          <td>
            <router-link :to="'/list/' + item.number">详情</router-link>
          </td>
        </tr>
      </template>
    </table>
  </div>
</template>

<style>
  table {
    border: 1px solid grey;
  }
</style>

<script>
  export default {
    props: {
      list: {
        type: Array,
        required: true,
      },
      loading: {
        type: Boolean,
        required: true,
      },
    },
  }
</script>
